import msgs from './message2.vue'
const MESSAGE ={
  show:true,
  duration:1000*6000,
  beArray:[],
  install(Vue) {
      if (typeof window !== 'undefined' && window.Vue) {
        Vue = window.Vue
      }
      Vue.component('Message', msgs);
      function msg(type, count,text, callBack) {
            console.log(text)
            let msg
          //   let duration = MESSAGE.duration
          //   if (typeof text === 'string') {
          //     msg = text.text
          //   } else if (text instanceof Object) {
          //     msg = text.text || ''
          //     if (text.duration) {
          //       duration = text.duration
          //     }
          // }
          console.log(text.text)
          let VueMessage =  Vue.extend({
              render(h) {
                  let props = {
                    type,
                    count:count,
                    text:text.text,
                    show: this.show
                  }
                  return h(msgs, {
                    props
                  })
              },
              data() {
                return {
                  show: false
                }
              }

            })

            let newMessage = new VueMessage()
            let vm = newMessage.$mount()
            console.log(vm,'istall  vmmm')
            let el = vm.$el
            if(MESSAGE.beArray.length>=1){
               document.body.removeChild(MESSAGE.beArray[0])
               MESSAGE.beArray.splice(0,1)
            }
            document.body.appendChild(el) // 把生成的提示的dom插入body中
            MESSAGE.beArray.push(el)
            vm.show = true
            let t1 = setTimeout(() => {
              clearTimeout(t1)
              vm.show = false //隐藏提示组件，此时会有300ms的动画效果，等动画效果过了再从body中移除dom
              let t2 = setTimeout(() => {
                clearTimeout(t2)
                document.body.removeChild(el) //从body中移除dom
                newMessage.$destroy()
                vm = null // 设置为null，好让js垃圾回收算法回收，释放内存

                callBack && (typeof callBack === 'function') && callBack()
              }, MESSAGE.duration)
            }, MESSAGE.duration)



      }
      Vue.prototype.$message2 = {
        info(text, callBack) {
          if (!text) return
          msg('info', text, callBack)
        },
        success(text, callBack) {
          if (!text) return
          msg('success', text, callBack)
        },
        error(text, callBack) {
          if (!text) return
          msg('error', text, callBack)
        },
        warning(text, callBack) {
          if (!text) return
          msg('warning', text, callBack)
        }
      }

  }
}
export default MESSAGE
